<template>
 <div class="score-group">
    <div class="between-x">
      <div class="wins">
        <DigitalNumber 
          :value="score.wins" 
          :len="6"/>
      </div>
      <div :class="'center circle bg-' + (game.running && 'red')">
        <span>JP</span>
      </div>
      <div class="total">
        <DigitalNumber 
          :value="score.total" 
          :len="6"/>
      </div>
    </div>
 </div>
</template>

<script setup lang="ts">
  import DigitalNumber from './DigitalNumber.vue'
  import useStore from '@/composables/useStore'
  const { game, score } = useStore()
</script>